<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>用户列表展现</title>
		
		<!-- 导包js函数类库 -->
		<script src="jquery-3.6.0.min.js"></script>
		<!-- 2.编辑js发起Ajzx请求 -->
		<script>
			//让页面加载完成之后再次执行 
			//语法:函数式编程
			$(function(){
				//alert("页面加载完成,jQuery调用成功")
				//利用Ajzx的get请求方式 http://localhost:8090/getUser
				//将数据以表格形式呈现出来
				//种类:1 $.get() 2 $.post() 1 $.ajax()
				var url= "http://localhost:8090/getUser2"
				
				/* 
				 $.ajax相关说明
				  格式: {key: value}
				  type: ajax请求的方式 get/post/put/delete
				  简化: $.get(...)  $.post(...)
				  url:远程服务器地址
				  JSONP:js端解决跨域问题的一种机制,现在几乎淘汰
				  cache: 默认值为true
				  async: 默认异步 true
				 */
				$.ajax({
					type: "get",
					url: "http://localhost:8090/getUser",
					//data: {key:value},
					 
					success: function(result){
						console.log(result)
					},
					error:function(){
						alert("服务器正忙,一边玩去")
					}
					
				})
				
			})
		</script>
		
	</head>
	<body>
		<table id="tab1" border="1px" width="700px" align="center">
			<tr>
				<td colspan="4" align="center">
				  <h1>表格数据</h1>	
				</td>
			</tr>
			<tr align="center">
				<td>ID编号:</td>
				<td>名称:</td>
				<td>年龄:</td>
				<td>性别:</td>
			</tr>
			
			
		</table>
		
	</body>
</html>
